<template>
  <div>
    <dialog-form
      v-model="dialogVisible"
      title="添加权限"
      :cancel-button="true"
      :confirm-button="true"
      :confirm-loading="confirmLoading"
      @confirm="confirmHandler"
    >
      <template #content>
        <BaseForm ref="baseForm" v-model="data"/>
      </template>
    </dialog-form>
  </div>
</template>

<script>
import { ref } from 'vue'
import DialogForm from '@/components/dialog/DialogForm'
import { insertPermission } from '@/api/permission'
import BaseForm from '@/views/permission/permission/form/base/PermissionBaseForm'

export default {
  name: 'InsertPermissionForm',
  components: { BaseForm, DialogForm },
  setup () {
    return {
      confirmLoading: ref(false),
      dialogVisible: ref(false),
      data: ref({
        name: '',
        code: '',
        router_path: ''
      })
    }
  },
  methods: {
    confirmHandler () {
      if (!this.data) {
        this.dialogVisible = false
      } else if (this.data) {
        this.confirmLoading = true
        console.log(this.data)
        insertPermission(this.data).then((val) => {
          this.$emit('change-msg')
          this.confirmLoading = this.dialogVisible = false
        })
      }
    },
    handleClose () {
      return null
    }
  },
  watch: {
    // dialogVisible: {
    //   function () {
    //     if (this.dialogVisible === true) {
    //       this.$refs.baseForm.getOptions()
    //     }
    //   }
    // }
  }
}
</script>

<style scoped>

</style>
